<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8" />
		<title></title>
		<style>

				
				ul {
						clear: both;
					    list-style-type: none;
					    margin: 0;
					    padding: 0;
					    overflow: hidden;
					    background-color: #333;
					    height: 50px;
					}
					
					li {
					    float: left;
					    border-left:cadetblue 1px solid;
					    width:100px;
					}
					
					li a {
					    display: block;
					    color: white;
					    text-align: center;
					    padding: 14px 16px;
					    text-decoration: none;
					}
					
					li a:hover:not(.active) {
					   background-image: url(img/4.jpg);	
					}
					
					.active {
					    background-image: url(img/4.jpg);	
					}
					
					.spans{
						float: right;
						margin-top: -50px;
					}
					.spans>span{
						margin-left: 50px;
					}
					input{
						background-color: red;
						width: 100px;
						color: white;
						border: #FF0000 1px solid;
					}
					.abc div{
						width: 300px;
						float: left;
						margin-left: 100px;
						
					}
					.abc div h1{color: red;}
					.abc :hover:not(.abc) {
					    background-image:url(img/背景.jpg);
					}
					.abc {
					    background-color: white;
					    clear: both;	
					}
					.clear{clear: both;}
					.b1>img{float: left;
							
					}
					.b1{
						width: 500px;
					}
					.red{color: red;}
					h5{
						color:gray;
						font-weight: 150;
					}
					.bb{
						height: 400px;
						width: 700px;
						margin-left: 100px;

					}
					 .bb:hover {
					    background-image:url(img/背景.jpg);
					}
					.bb{
						background-color: white;
						
					}
					.bbb>div{
						float: left;
					}
					.cc{
						margin-left: 100px;
					}
					.c1 div span{
						color: deepskyblue;
						
					}
					.c1 div{
						margin-top: 5px;
					}
					.foot{
						margin: 30px;
						text-align: center;
						color:gray;
					.blue{
							color: deepskyblue;
					}

					
					
		</style>

	</head>
	<body>
		<header>
			<div class="lefts">
				<div><h1 style="font-weight: 500;">ftt_Be<span style="color: red;">成功</span></h1></div>
				<div class="spans"><span>关于</span><span>网站地图</span><span>联系</span></div>
							
			</div>
			<ul>
			  <li><a class="active" href="#home">家</a><>
			  <li><a href="#boke">博客</a><>
			  <li><a href="#images">图片</a><>
			  <li><a href="#lianjie">链接</a><>
			  <li><a href="#lianxi">联系</a><>
			</ul>
		</header>
		<section>
			<img src="img/01.jpg" width="100%" />
			<div class="abc">
				<div>
					<h1>解决方案</h1>
					<h5>这有可能是地面射灯的光线在大气层中的暂留现象，之所以会以螺旋状的轨迹移动，则是由气流影响暂留的光线造成的。</h5>
					<input type="button" value="详细信息" />
				</div>
				<div>
					<h1>解决方案</h1>
					<h5>这有可能是地面射灯的光线在大气层中的暂留现象，之所以会以螺旋状的轨迹移动，则是由气流影响暂留的光线造成的。</h5>
					<input type="button" value="详细信息" />
				</div>
				<div>
					<h1>解决方案</h1>
					<h5>这有可能是地面射灯的光线在大气层中的暂留现象，之所以会以螺旋状的轨迹移动，则是由气流影响暂留的光线造成的。</h5>
					<input type="button" value="详细信息" />
				</div>
			</div>
			<div class="clear"></div>
			<div class="bbb">
				<div class="bb">
					<h1 class="red">解决方案</h1>
					<div class="b1">
						<img src="img/2.jpg" width="150px" height="100px" />
						<h5>王佳林先生从桂林乘机返回重庆， 飞机 升空后不久，他便通过舷窗望见了奇异的一幕：3个明亮的光点以螺旋状 轨迹 从远处飞过，大约30秒后又莫名消失了。
	3个光点居然是以螺旋状的飞行轨迹在向前移动，明显不可能是飞机，感觉像飞碟。独自坐在最后一排的王先生急忙拿出随身携带的数码相机，拍下了这奇异的一幕。
	而天文科普教育协会的秘书长解释：这并不是什么不明飞行物的ufo事件，类似情况的反映，他们已接到过多次：“这有可能是地面射灯的光线在大气层中的暂留现象，之所以会以螺旋状的轨迹移动，则是由气流影响暂留的光线造成的。”
						</h5>
					</div>
				</div>
				<div class="cc">
					<h1 class="red">链接</h1>
					<div class="c1">
							<div><img src="img/3.jpg""  /><span>我是帅哥<span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥</span></div>	
							<div><img src="img/3.jpg""  /><span>我是帅哥<span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥<span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥</span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥<span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥</span></div>	
							<div><img src="img/3.jpg""  /><span>我是帅哥<span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥<span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥</span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥<span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥</span></div>	
							<div><img src="img/3.jpg""  /><span>我是帅哥<span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥<span></div>
							<div><img src="img/3.jpg""  /><span>我是帅哥</span></div>
					</div></a></div>							
					</div>
				</div>

				
			</div>
			<div class="clear"></div>
		</section>
		
		<footer>
			<hr />
			<div class="foot">
				版权很重要，©2019 jiaBaidu 使用假百度前必读 意见反馈<span class="blue">免费模板</span> 啊京ICP证1030173号<span class="blue">模板之家</span>  京公网安备110000020001001号 
			</div>
		</footer>
	</body>
</html>
